<template>
	<view>
		<view style="padding: 20upx 40upx;">
			<view class="item" style="width: 100%;margin: 20upx 0upx;min-height: 386upx;border-radius: 20upx;border: 1upx solid #DDDDDD;box-shadow: 1upx 1upx 10upx #DDDDDD;position: relative;color: #fff;background-image: #620729;background-image: linear-gradient(to right, #d01819,#ff0044,#d01819,#d01819);background-repeat:no-repeat;background-size: 750upx 386upx;">
				<view style="position: absolute;z-index: 2;left: 0;top: 120upx;width: 95%;margin: 0 2.5%;">
					<view style="margin: 30upx 50upx;">
						<text style="font-size: 70upx;">{{total_num}}</text>
					</view>
					<view style="position: relative;">
						<text style="font-size: 30upx;margin: 20upx 50upx;">总分红券</text>
					</view>
				</view>
			</view>
			<view style="font-size: 38upx;font-weight: bold;margin: 50upx 0upx;">
				分红券记录
			</view>
			<view>
			      <view class="uni-list">
			          <block v-for="(item,index) in list" :key="index">
			              <view class="uni-list-cell" hover-class="uni-list-cell-hover">
			                  <view class="uni-triplex-row">
			                      <view class="uni-triplex-left">
			                          <text class="uni-title uni-ellipsis" 
																	style="font-size: 28upx;padding: 0;">{{item.remark}}</text>
			                          <text class="uni-text" style="font-size: 24upx;">{{item.createtime}}</text>
			                      </view>
			                      <view class="uni-triplex-right" style="width: 160upx;">
			                          <view class="status" style="background: #04ab02;margin-top: 20upx; color: #fff;text-align: center;">{{item.num}}</view>
			                      </view>
			                  </view>
			              </view>
			          </block>
			      </view>
				<view v-if="list.length == 0" style="padding-top: 100upx;">
					<image src="../../static/searchlist.png" mode="" style="display: block;margin: 0 auto;width: 240upx;height: 240upx;"></image>
					<view style="text-align: center;color: #999;">暂时没有任何记录</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				res:{},
				list:[],
				user_id:'',
				error:'',
				message:'',
				total_num:'',
			};
		},
		onLoad:function(){
			uni.showLoading()
			uni.getStorage({
				key: 'openid',
				success: (res) => {
					this.openid = res.data
					this.setAjax()
				},
				fail: () => {
					uni.navigateTo({
						url: '../../index/index'
					});
				}
			});
		},
		methods:{
			setAjax(){
				uni.request({
					url: 'http://mall.sytesco.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=order.luckdraw.fen_list&app=1',
					method: 'POST',
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					data: {
						'openid':this.openid,
						'type' : 'wp_coupon'
						},
					success: res => {
						this.res = res.data
						this.list = res.data.list
						this.total_num = res.data.total_num
						console.log(this.res)
						
					},
					fail: () => {},
					complete: () => {}
				});
				uni.hideLoading()
			},
			jump(e){
				uni.navigateTo({
					url: e.currentTarget.dataset.src
				});
			},
		}
	}
</script>

<style lang='scss'>
	page{
		background: $page-color-base;
	}
	.list-cell{
		/* border: 1upx solid #DDDDDD; */
		box-shadow: 1upx 1upx 10upx #DDDDDD;
		border-radius: 20upx;
		display:flex;
		align-items:baseline;
		padding: 20upx $page-row-spacing;
		line-height:60upx;
		position:relative;
		background: #fff;
		justify-content: center;
		&.log-out-btn{
			margin-top: 40upx;
			.cell-tit{
				color: #000;
				text-align: center;
				margin-right: 0;
			}
		}
		&.cell-hover{
			background:#fafafa;
		}
		&.b-b:after{
			left: 30upx;
		}
		&.m-t{
			margin-top: 16upx; 
		}
		.cell-more{
			align-self: baseline;
			font-size:$font-lg;
			color:$font-color-light;
			margin-left:10upx;
		}
		.cell-tit{
			flex: 1;
			font-size: $font-base + 2upx;
			color: $font-color-dark;
			margin-right:10upx;
		}
		.cell-tip{
			font-size: $font-base;
			color: $font-color-light;
		}
		switch{
			transform: translateX(16upx) scale(.84);
		}
	}
</style>

